<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>SCB First to Enjoy</title>
	<link rel="stylesheet" href="css/global.css" media="all" />
	<link rel="stylesheet" href="css/style.css" media="all" />
	<script src="js/jquery.min.js"></script>
    </head>
    <body>
	<div id="fb-root"></div>
	<script type="text/javascript">
	    window.fbAsyncInit = function() {
		FB.init({
		    appId: '{$fb_app_id}',
		    status: true,
		    cookie: true,
		    xfbml: true
		});
		FB.Canvas.setSize({width: 810, height: 834});
	    };
	    (function() {
		var e = document.createElement('script'); e.async = true;
		e.src = document.location.protocol +
		'//connect.facebook.net/en_US/all.js';
		document.getElementById('fb-root').appendChild(e);
	    }());
	</script>
	
	<!-- Markup for These Days Friend Selector -->
	<div id="TDFriendSelector" class="hidden">
	    <div class="TDFriendSelector_dialog">
		<a href="#" id="TDFriendSelector_buttonClose">x</a>
		<div class="TDFriendSelector_form">
		    <div class="TDFriendSelector_header">
			<p>Select your friends</p>
		    </div>
		    <div class="TDFriendSelector_content">
			<p>Then you can invite them to join you in the app.</p>
			<div class="TDFriendSelector_searchContainer TDFriendSelector_clearfix">
			    <div class="TDFriendSelector_selectedCountContainer"><span class="TDFriendSelector_selectedCount">0</span> / <span class="TDFriendSelector_selectedCountMax">0</span> friends selected</div>
			    <input type="text" placeholder="Search friends" id="TDFriendSelector_searchField" />
			</div>
			<div class="TDFriendSelector_friendsContainer"></div>
		    </div>
		    <div class="TDFriendSelector_footer TDFriendSelector_clearfix">
			<a href="#" id="TDFriendSelector_pagePrev" class="TDFriendSelector_disabled">Previous</a>
			<a href="#" id="TDFriendSelector_pageNext">Next</a>
			<div class="TDFriendSelector_pageNumberContainer">
			    Page <span id="TDFriendSelector_pageNumber">1</span> / <span id="TDFriendSelector_pageNumberTotal">1</span>
			</div>
			<a href="#" id="TDFriendSelector_buttonOK">OK</a>
		    </div>
		</div>
	    </div>
	</div>
	
	<div id="wrapper" class="wrapper-sorry">
	    
            <a href="javascript:void(0);" title="Next" id="sorry-bt">&nbsp;</a>
	    
	    <div class="hidden">
		<a href="#ajax-loader-block" id="ajax-loader" class="acolorbox">Please wait...</a>
		<div id="ajax-loader-block" style="padding:15px 10px 5px 10px;background:#000000;text-align:center;-webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px;opacity: 0.7;color: #cccccc;">
		    <img src="images/284.gif" alt="Please wait..." style="width:60px;" />
		    <p>Please wait...</p>
		</div>
		
		<script type="text/javascript" src="js/fancybox/jquery.fancybox.pack.js"></script>
		<link rel="stylesheet" href="js/fancybox/jquery.fancybox.css" media="all" />
		<script type="text/javascript" src="js/friend-selector/tdfriendselector.js"></script>
		<link rel="stylesheet" href="js/friend-selector/tdfriendselector.css" />
		<script>
		    $(document).ready(function(){
			    $('.acolorbox').fancybox({
				'closeBtn':false,
				'autoDimensions' : false,
				'autoScale' : false,
				'closeClick' : false,
				'helpers' :  {
				    overlay : {
					closeClick: false
				    }
				}
			    });
		    });
		    
		    TDFriendSelector.init();
		    
		    selector1 = TDFriendSelector.newInstance({
			maxSelection : 1,
			friendsPerPage : 5,
			callbackSubmit: function(selectedFriendIds) {
			    send_to_friends(selectedFriendIds[0]);
			}
		    });
		    
		    $("#sorry-bt").click(function (e) {
			$("#ajax-loader").click();
			e.preventDefault();
			selector1.showFriendSelector();
			$.fancybox.close();
		    });
		    
		    function send_to_friends(friend_id)
		    {
			FB.ui({
				method: 'stream.publish',
				app_id: '{$fb_app_id}',
				display: 'iframe',
				name: 'FIRST TO ENJOY with SCB Credit card',
				link: '{$fb_page_url}',
				picture: '{$site_url}assets/images/icon.jpg',
				caption: 'ร่วมสนุกและลุ้นรับของรางวัลต่างๆ มากมาย',
				description: 'พร้อมติดตามเราอย่างต่อเนื่องที่ แฟนเพจ SCB CREDIT CARD',
				target_id: friend_id
			    },
			    function(response) {
				window.location = '{$site_url}';
			    }
			);
		    }
		</script>
		<!-- Markup for These Days Friend Selector END -->
	    </div>
        </div>
    </body>
</html>